<#include "./template.ftl">

<#macro head>
    <title>问答-Morketing</title>
    <link rel="stylesheet" href="${base}/client/css/wenda.css">
<style type="text/css">
    .zan{
        cursor:pointer;
    }
</style>
</#macro>
<#macro content>
    <div id="contents">
        <div class="wenda-bar">
             <h2>问答互动</h2>
        </div>
        <div class="main wrap clearfix wenda-detail-wrap">
            <div class="main-left f-l clearfix">
            <#if q??>
                 <div class="wenda-detail">
                      <div class="wenda-detail-info wd-list">
                          <h3>${q.title}</h3>
                           <div class="tips"><span>${q.createTimeStr}</span> <span>提问者：${q.creatorStr}</span></div>
                           <p class="p">${q.content}</p>
                      </div>

                      <div class="wenda-detail-sumit">
                          <h4>共<span id="answerNum">${q.num}</span>个回答</h4>

                          <ul class="answer" style="clear:both">
                              <#if answers??>
                                  <#list answers as a>
                                    <li>
                                          <div class="pic">
                                              <#if a?? && a.userPhoto??>
                                                  <img width="100%" src="${base}/system/getImg?imgId=${a.userPhoto!''}&w=88" alt="">
                                              <#else>
                                                  <img width="100%" src="${base}/client/images/pic/myself/user.png" alt="">
                                              </#if>
                                          </div>
                                          <h5>${a.creatorStr}</h5>
                                          <div class="time">${a.createTimeStr}</div>
                                          <p class="ans">${a.content}</p>
                                        <div class='zan' onclick='up(this,${a.id})'><img src='${base}/client/images/pic/wenda/zan.png' alt=''><span class='zan_count'>${a.likes}</span></div>
                                    </li>
                                  </#list>
                              </#if>
                          </ul>

                          <h4>我来回答</h4>
                          <textarea class="wenda-my" placeholder="写回答..." name="" id="answer" cols="30" rows="10"></textarea>
                          <button class="f-r wenda-submit" onclick="answerQ('${q.id}')">发布回答</button>
                      </div>
                 </div>
            </#if>
            </div>
            <#include "widget/latestQuestion.ftl"/>
        </div>
    </div>
</#macro>
<#macro js>
<script type="text/javascript">
    var answerQ = function(id){
        var content = $("#answer").val().trim();
        if(content.length == 0){ alert("请输入内容！"); return false;}

        if(content.length > 100){ alert("不能超过100字"); return false;}

        jQuery.ajax({
            type: "POST",
            url: '${base}/question/answer',
            dataType:"json",
            data: {"id":id,"content":content},
            success: function(data){
                if(data.status == 1) {
                    data = data.data;
                    var userPhotoSrc = "${base}/client/images/pic/myself/user.png";
                    if(data.userPhoto != null && data.userPhoto != ''){
                        userPhotoSrc = "${base}/system/getImg?imgId="+ data.userPhoto;
                    }
                    $(".answer").append("<li>"+
                            "<div class='pic'>"+
                            "<a href='${base}/profile?userId=" + data.userId +"'><img  src='"+ userPhotoSrc +"' alt=''></a>"+
                            "</div>"+
                            "<h5><a href='${base}/profile?userId=" + data.userId +"'>"+ data.creatorStr +"</a></h5>"+
                            "<div class='time'>"+ data.createTimeStr+"</div>"+
                            "<p class='ans'>"+data.content+"</p>"+
                            "<div class='zan' onclick='up(this,"+data.id +")'><img src='${base}/client/images/pic/wenda/zan.png' alt=''><span class='zan_count'>"+data.likes+"</span></div>" +
                            "</li>");
                    $("#answer").val("");
                    var num = $("#answerNum").html();
                    num++;
                    $("#answerNum").html(num);
                }else if(data.status == -1){
                    alert("您还没有登录，请登录！");
                    location.replace("${base}/login?redirect_url=" + window.location.href);
                }
            },
            error: function (obj){
                console.info(obj);
            }
        });
    };

    var up = function(obj,id){
        console.info(obj);
        if ($(obj).hasClass('done')) {
            alert("您已赞过！");
            return false;
        } else {
            $(obj).addClass('done');
            var rateHolder = $(obj).children('.zan_count');
            var ajax_data = {
                id: id
            };
            $.post("${base}/wenda_answer/up", ajax_data,
                    function (data) {
                        console.info(data);
                        $(rateHolder).html(data.data);
                    });
            return false;
        }
    }
</script>
<script>

</script>
</#macro>
